<template>
  <div class="historypage tapStyle secondary-page-mode" style="margin-top:0px">
    <div class="currency-mode-wrap" style="height: 100%;margin-top:0px">
      <yf-tabs type="border-card">
        <yf-tab-pane label="断面信息" v-if="s_Type == 'water'">
          <el-scrollbar style="height:100%">
            <div class="baseinfo">
              <div class="addbox" style="text-align:right;margin-bottom:12px;">
                <el-button type="noticon" @click="addStation">
                  <i class="iconfont icon-tianjia1"></i>新增
                </el-button>
              </div>
              <ul>
                <el-form :model="water" :rules="waterruleData" ref="wform">
                  <li>
                    <span class="layoutspan">
                      <i>*</i>断面名称 :
                    </span>&nbsp;
                    <div class="layoutBox" style="width:200px">
                      <el-form-item prop="stationName">
                        <el-input v-model="water.stationName"></el-input>
                      </el-form-item>
                    </div>
                    <span class="layoutspan">
                      <i>*</i>断面编号 :
                    </span>&nbsp;
                    <div class="layoutBox" style="width:200px">
                      <el-form-item prop="stationCode">
                        <el-input v-model="water.stationCode"></el-input>
                      </el-form-item>
                    </div>
                    <span class="layoutspan">
                      <i>*</i>经度-纬度 :
                    </span>&nbsp;
                    <div class="layoutBox" style="width:75px">
                      <el-form-item prop="longitude">
                        <el-input v-model="water.longitude"></el-input>
                      </el-form-item>
                    </div>-
                    <div class="layoutBox" style="width:75px">
                      <el-form-item prop="latitude">
                        <el-input v-model="water.latitude"></el-input>
                      </el-form-item>
                    </div>
                    <span class="sousuo" @click="openMap('water')">
                      <i class="iconfont icon-sousuo"></i>
                    </span>
                  </li>
                  <li>
                    <span class="layoutspan">控制等级 :</span>&nbsp;
                    <div class="layoutBox" style="width:200px">
                      <el-form-item prop="controlorLevel">
                        <el-select
                          v-model="water.controlorLevel"
                          placeholder="请选择"
                          @change="selectChange"
                        >
                          <el-option
                            v-for="item in controlorData"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value"
                          ></el-option>
                        </el-select>
                      </el-form-item>
                    </div>
                    <span class="layoutspan">站点类别 :</span>&nbsp;
                    <div class="layoutBox" style="width:200px">
                      <el-select
                        disabled
                        v-model="water.stationType"
                        placeholder="请选择"
                        @change="selectChange"
                      >
                        <el-option
                          v-for="item in stationTypeData"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value"
                        ></el-option>
                      </el-select>
                    </div>
                    <span class="layoutspan">
                      <i>*</i>水质目标级别 :
                    </span>&nbsp;
                    <div class="layoutBox" style="width:200px">
                      <el-form-item prop="targetLevel">
                        <el-select
                          v-model="water.targetLevel"
                          placeholder="请选择"
                          @change="selectChange"
                        >
                          <el-option
                            v-for="item in targetDataA"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value"
                          ></el-option>
                        </el-select>
                      </el-form-item>
                    </div>
                  </li>
                  <li>
                    <span class="layoutspan">
                      <i>*</i>城市 :
                    </span>&nbsp;
                    <div class="layoutBox" style="width:200px">
                      <el-form-item prop="city">
                        <el-select v-model="water.city" placeholder="请选择" @change="cityChange">
                          <el-option
                            v-for="item in cityData"
                            :key="item.id"
                            :label="item.name"
                            :value="item.id"
                          ></el-option>
                        </el-select>
                      </el-form-item>
                    </div>
                    <span class="layoutspan">
                      <i>*</i>区县 :
                    </span>&nbsp;
                    <div class="layoutBox" style="width:200px">
                      <el-form-item prop="county">
                        <el-select v-model="water.county" placeholder="请选择">
                          <el-option
                            v-for="item in countyData"
                            :key="item.id"
                            :label="item.name"
                            :value="item.id"
                          ></el-option>
                        </el-select>
                      </el-form-item>
                    </div>
                  </li>
                  <li>
                    <span class="layoutspan">站点地址 :</span>&nbsp;
                    <div class="layoutBox" style="width:863px">
                      <el-input v-model="water.stationAddress"></el-input>
                    </div>
                  </li>
                </el-form>
              </ul>
            </div>
            <div></div>
            <div class="btn" style="width:1140px;text-align: center">
              <el-button type="noticon" @click="saveStation('wform')">保存</el-button>
            </div>
          </el-scrollbar>
        </yf-tab-pane>
        <yf-tab-pane label="排污口信息" v-if="s_Type == 'pollution'">
          <el-scrollbar style="height:100%">
            <div class="baseinfo">
              <div class="addbox" style="text-align:right;margin-bottom:12px;">
                <el-button type="noticon" @click="addStation">
                  <i class="iconfont icon-tianjia1"></i>新增
                </el-button>
              </div>
              <ul>
                <el-form :model="pollution" :rules="pollutionruleData" ref="pform">
                  <li>
                    <span class="layoutspan">
                      <i>*</i>排污口名称 :
                    </span>&nbsp;
                    <div class="layoutBox" style="width:200px">
                      <el-form-item prop="stationName">
                        <el-input v-model="pollution.stationName"></el-input>
                      </el-form-item>
                    </div>
                    <span class="layoutspan">
                      <i>*</i>排污口编号 :
                    </span>
                    &nbsp;
                    <div class="layoutBox" style="width:200px">
                      <el-form-item prop="stationCode">
                        <el-input v-model="pollution.stationCode"></el-input>
                      </el-form-item>
                    </div>
                    <span class="layoutspan">
                      <i>*</i>经度-纬度 :
                    </span>&nbsp;
                    <div class="layoutBox" style="width:75px">
                      <el-form-item prop="longitude">
                        <el-input v-model="pollution.longitude"></el-input>
                      </el-form-item>
                    </div>-
                    <div class="layoutBox" style="width:75px">
                      <el-form-item prop="latitude">
                        <el-input v-model="pollution.latitude"></el-input>
                      </el-form-item>
                    </div>
                    <span class="sousuo" @click="openMap('pollution')">
                      <i class="iconfont icon-sousuo"></i>
                    </span>
                  </li>

                  <li>
                    <span class="layoutspan">控制等级 :</span>&nbsp;
                    <div class="layoutBox" style="width:200px">
                      <el-form-item prop="controlorLevel">
                        <el-select
                          v-model="pollution.controlorLevel"
                          placeholder="请选择"
                          @change="selectChange"
                        >
                          <el-option
                            v-for="item in controlorData"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value"
                          ></el-option>
                        </el-select>
                      </el-form-item>
                    </div>
                    <span class="layoutspan">站点类别 :</span>&nbsp;
                    <div class="layoutBox" style="width:200px">
                      <el-select
                        disabled
                        v-model="pollution.stationType"
                        placeholder="请选择"
                        @change="selectChange"
                      >
                        <el-option
                          v-for="item in stationTypeData"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value"
                        ></el-option>
                      </el-select>
                    </div>
                    <span class="layoutspan">排放标准 :</span>&nbsp;
                    <div class="layoutBox" style="width:200px">
                      <el-form-item prop="targetLevel">
                        <el-select
                          v-model="pollution.targetLevel"
                          placeholder="请选择"
                          @change="selectChange"
                        >
                          <el-option
                            v-for="item in targetDataB"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value"
                          ></el-option>
                        </el-select>
                      </el-form-item>
                    </div>
                  </li>
                  <li>
                    <span class="layoutspan">
                      <i>*</i>城市 :
                    </span>&nbsp;
                    <div class="layoutBox" style="width:200px">
                      <el-form-item prop="city">
                        <el-select v-model="pollution.city" placeholder="请选择" @change="cityChange">
                          <el-option
                            v-for="item in cityData"
                            :key="item.id"
                            :label="item.name"
                            :value="item.id"
                          ></el-option>
                        </el-select>
                      </el-form-item>
                    </div>
                    <span class="layoutspan">
                      <i>*</i>区县 :
                    </span>&nbsp;
                    <div class="layoutBox" style="width:200px">
                      <el-form-item prop="county">
                        <el-select v-model="pollution.county" placeholder="请选择">
                          <el-option
                            v-for="item in countyData"
                            :key="item.id"
                            :label="item.name"
                            :value="item.id"
                          ></el-option>
                        </el-select>
                      </el-form-item>
                    </div>
                  </li>
                  <li>
                    <span class="layoutspan">站点地址 :</span>&nbsp;
                    <div class="layoutBox" style="width:863px">
                      <el-input v-model="pollution.stationAddress"></el-input>
                    </div>
                  </li>
                </el-form>
              </ul>
            </div>
            <div></div>
            <div class="btn" style="width:1140px;text-align: center">
              <el-button type="noticon" @click="saveStation('pform')">保存</el-button>
            </div>
          </el-scrollbar>
        </yf-tab-pane>
        <!-- <yf-tab-pane label="仪器参数">
          <div class="tablebox">
            <el-table :data="tableData" border style="width: 100%;">
              <el-table-column type="index" :index="indexMethod" width="50"></el-table-column>
              <el-table-column prop="name" label="监测项目"></el-table-column>
              <el-table-column prop="name" label="分析仪器"></el-table-column>
              <el-table-column prop="name" label="仪器厂家"></el-table-column>
              <el-table-column prop="name" label="分析方法"></el-table-column>
              <el-table-column prop="name" label="试剂"></el-table-column>
              <el-table-column prop="name" width="66" label="检出限"></el-table-column>
              <el-table-column prop="name" width="134" label="标准上限-下限"></el-table-column>
              <el-table-column prop="name" width="79" label="浓度单位"></el-table-column>
              <el-table-column prop="name" width="120" label="出厂编号"></el-table-column>
              <el-table-column prop="name" width="120" label="安装时间"></el-table-column>
              <el-table-column prop="name" width="75" label="是否启用"></el-table-column>
              <el-table-column prop="name" width="120" label="操作">
                <el-button type="secondBtn" @click="visiDialog = true">编辑</el-button>
              </el-table-column>
            </el-table>
          </div>
        </yf-tab-pane>
        <yf-tab-pane label="站点图片">站点图片</yf-tab-pane>-->
      </yf-tabs>
    </div>
    <el-dialog :visible.sync="visiDialog" width="650px" title="仪器参数编辑" :before-close="closess">
      <div class="dialogcontent">
        <div class="dialog-layout">
          <ul class="formul">
            <li>
              <div style="margin-right:42px">
                <span class="layoutspan">参数名称 :</span>&nbsp;
                <div class="layoutBox" style="width:200px">
                  <el-select
                    v-model="value1"
                    placeholder="请输入或选择"
                    filterable
                    allow-create
                    default-first-option
                  >
                    <el-option
                      v-for="item in optionData"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    ></el-option>
                  </el-select>
                </div>
              </div>
              <div>
                <span class="layoutspan" style="width:77.5px">厂家 :</span>&nbsp;
                <div class="layoutBox" style="width:200px">
                  <el-select
                    v-model="value1"
                    placeholder="请输入或选择"
                    filterable
                    allow-create
                    default-first-option
                  >
                    <el-option
                      v-for="item in optionData"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    ></el-option>
                  </el-select>
                </div>
              </div>
            </li>
            <li>
              <div style="margin-right:42px">
                <span class="layoutspan">仪器设备 :</span>&nbsp;
                <div class="layoutBox" style="width:200px">
                  <el-select
                    v-model="value1"
                    placeholder="请输入或选择"
                    filterable
                    allow-create
                    default-first-option
                  >
                    <el-option
                      v-for="item in optionData"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    ></el-option>
                  </el-select>
                </div>
              </div>
              <div>
                <span class="layoutspan" style="width:77.5px">分析方法 :</span>&nbsp;
                <div class="layoutBox" style="width:200px">
                  <el-input v-model="value1" disabled></el-input>
                </div>
              </div>
            </li>

            <li>
              <div style="margin-right:42px">
                <span class="layoutspan" style="width:63.5px">检出限 :</span>&nbsp;
                <div class="layoutBox" style="width:200px">
                  <el-input v-model="value1" disabled></el-input>
                </div>
              </div>
              <div>
                <span class="layoutspan">标准上下限 :</span>&nbsp;
                <div class="layoutBox" style="width:95px">
                  <el-input v-model="value1" disabled></el-input>
                </div>-
                <div class="layoutBox" style="width:95px">
                  <el-input v-model="value1" disabled></el-input>
                </div>
              </div>
            </li>
            <li>
              <div style="margin-right:42px">
                <span class="layoutspan">出厂编号 :</span>&nbsp;
                <div class="layoutBox" style="width:200px">
                  <el-input v-model="value1"></el-input>
                </div>
              </div>
              <div>
                <span class="layoutspan" style="width:77.5px">安装时间 :</span>&nbsp;
                <div class="layoutBox" style="width:200px">
                  <el-date-picker v-model="value1" type="datetime" placeholder="选择日期时间"></el-date-picker>
                </div>
              </div>
            </li>
            <li>
              <div style="margin-right:42px">
                <span class="layoutspan">是否开启 :</span>&nbsp;
                <div class="layoutBox" style="width:200px;height:30px;line-height:30px">
                  <el-radio v-model="radio" label="1">是</el-radio>
                  <el-radio v-model="radio" label="2">否</el-radio>
                </div>
              </div>
              <span class="layoutspan" style="width:77.5px">试剂 :</span>&nbsp;
              <div class="layoutBox" style="width:200px">
                <el-select v-model="value5" multiple placeholder="请选择">
                  <el-option
                    v-for="item in optionData"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  ></el-option>
                </el-select>
              </div>
            </li>
          </ul>
        </div>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button type="noticon">保 存</el-button>
        <el-button type="noticonsecondBtn" @click="visiDialog = false">关 闭</el-button>
      </div>
    </el-dialog>
    <el-dialog :visible.sync="stationDialog" width="1065px" title="站点新增" :before-close="closess">
      <div class="dialogcontent">
        <div class="dialog-layout baseinfo">
          <ul class="formul" v-if="s_Type == 'water'">
            <el-form :model="waterFormData" :rules="waterruleData" ref="waterForm">
              <li>
                <span class="layoutspan">
                  <i>*</i>断面名称 :
                </span>&nbsp;
                <div class="layoutBox" style="width:200px">
                  <el-form-item prop="stationName">
                    <el-input v-model="waterFormData.stationName"></el-input>
                  </el-form-item>
                </div>
                <span class="layoutspan">
                  <i>*</i>断面编号 :
                </span>&nbsp;
                <div class="layoutBox" style="width:200px">
                  <el-form-item prop="stationCode">
                    <el-input v-model="waterFormData.stationCode"></el-input>
                  </el-form-item>
                </div>
                <span class="layoutspan" @click="mapDialog=true">
                  <i>*</i>经度-纬度 :
                </span>&nbsp;
                <div class="layoutBox" style="width:75px">
                  <el-form-item prop="longitude">
                    <el-input v-model="waterFormData.longitude"></el-input>
                  </el-form-item>
                </div>-
                <div class="layoutBox" style="width:75px">
                  <el-form-item prop="latitude">
                    <el-input v-model="waterFormData.latitude"></el-input>
                  </el-form-item>
                </div>
                <span class="sousuo" @click="openMap('waterF')">
                  <i class="iconfont icon-sousuo"></i>
                </span>
              </li>
              <li>
                <span class="layoutspan">控制等级 :</span>&nbsp;
                <div class="layoutBox" style="width:200px">
                  <el-form-item prop="controlorLevel">
                    <el-select
                      v-model="waterFormData.controlorLevel"
                      placeholder="请选择"
                      @change="selectChange"
                    >
                      <el-option
                        v-for="item in controlorData"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                      ></el-option>
                    </el-select>
                  </el-form-item>
                </div>
                <span class="layoutspan">站点类别 :</span>&nbsp;
                <div class="layoutBox" style="width:200px">
                  <el-select
                    disabled
                    v-model="waterFormData.stationType"
                    placeholder="请选择"
                    @change="selectChange"
                  >
                    <el-option
                      v-for="item in stationTypeData"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    ></el-option>
                  </el-select>
                </div>
                <span class="layoutspan">
                  <i>*</i>水质目标级别 :
                </span>&nbsp;
                <div class="layoutBox" style="width:200px">
                  <el-form-item prop="targetLevel">
                    <el-select
                      v-model="waterFormData.targetLevel"
                      placeholder="请选择"
                      @change="selectChange"
                    >
                      <el-option
                        v-for="item in targetDataA"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                      ></el-option>
                    </el-select>
                  </el-form-item>
                </div>
              </li>
              <li>
                <span class="layoutspan">
                  <i>*</i>城市 :
                </span>&nbsp;
                <div class="layoutBox" style="width:200px">
                  <el-form-item prop="city">
                    <el-select v-model="waterFormData.city" placeholder="请选择" @change="cityChange">
                      <el-option
                        v-for="item in cityData"
                        :key="item.id"
                        :label="item.name"
                        :value="item.id"
                      ></el-option>
                    </el-select>
                  </el-form-item>
                </div>
                <span class="layoutspan">
                  <i>*</i>区县 :
                </span>&nbsp;
                <div class="layoutBox" style="width:200px">
                  <el-form-item prop="county">
                    <el-select v-model="waterFormData.county" placeholder="请选择">
                      <el-option
                        v-for="item in countyData"
                        :key="item.id"
                        :label="item.name"
                        :value="item.id"
                      ></el-option>
                    </el-select>
                  </el-form-item>
                </div>
              </li>
              <li>
                <span class="layoutspan">站点地址 :</span>&nbsp;
                <div class="layoutBox" style="width:863px">
                  <el-input v-model="waterFormData.stationAddress"></el-input>
                </div>
              </li>
            </el-form>
          </ul>

          <ul class="formul" v-if="s_Type == 'pollution'">
            <el-form :model="pollutionFormData" :rules="pollutionruleData" ref="waterForm">
              <li>
                <span class="layoutspan">
                  <i>*</i>排污口名称 :
                </span>&nbsp;
                <div class="layoutBox" style="width:200px">
                  <el-form-item prop="stationName">
                    <el-input v-model="pollutionFormData.stationName"></el-input>
                  </el-form-item>
                </div>
                <span class="layoutspan">
                  <i>*</i>排污口编号 :
                </span>
                &nbsp;
                <div class="layoutBox" style="width:200px">
                  <el-form-item prop="stationCode">
                    <el-input v-model="pollutionFormData.stationCode"></el-input>
                  </el-form-item>
                </div>
                <span class="layoutspan">
                  <i>*</i>经度-纬度 :
                </span>&nbsp;
                <div class="layoutBox" style="width:75px">
                  <el-form-item prop="longitude">
                    <el-input v-model="pollutionFormData.longitude"></el-input>
                  </el-form-item>
                </div>-
                <div class="layoutBox" style="width:75px">
                  <el-form-item prop="latitude">
                    <el-input v-model="pollutionFormData.latitude"></el-input>
                  </el-form-item>
                </div>
                <span class="sousuo" @click="openMap('pollutionF')">
                  <i class="iconfont icon-sousuo"></i>
                </span>
              </li>

              <li>
                <span class="layoutspan">控制等级 :</span>&nbsp;
                <div class="layoutBox" style="width:200px">
                  <el-form-item prop="controlorLevel">
                    <el-select
                      v-model="pollutionFormData.controlorLevel"
                      placeholder="请选择"
                      @change="selectChange"
                    >
                      <el-option
                        v-for="item in controlorData"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                      ></el-option>
                    </el-select>
                  </el-form-item>
                </div>
                <span class="layoutspan">站点类别 :</span>&nbsp;
                <div class="layoutBox" style="width:200px">
                  <el-select
                    disabled
                    v-model="pollutionFormData.stationType"
                    placeholder="请选择"
                    @change="selectChange"
                  >
                    <el-option
                      v-for="item in stationTypeData"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    ></el-option>
                  </el-select>
                </div>
                <span class="layoutspan">排放标准 :</span>&nbsp;
                <div class="layoutBox" style="width:200px">
                  <el-form-item prop="targetLevel">
                    <el-select
                      v-model="pollutionFormData.targetLevel"
                      placeholder="请选择"
                      @change="selectChange"
                    >
                      <el-option
                        v-for="item in targetDataB"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                      ></el-option>
                    </el-select>
                  </el-form-item>
                </div>
              </li>
              <li>
                <span class="layoutspan">
                  <i>*</i>城市 :
                </span>&nbsp;
                <div class="layoutBox" style="width:200px">
                  <el-form-item prop="city">
                    <el-select
                      v-model="pollutionFormData.city"
                      placeholder="请选择"
                      @change="cityChange"
                    >
                      <el-option
                        v-for="item in cityData"
                        :key="item.id"
                        :label="item.name"
                        :value="item.id"
                      ></el-option>
                    </el-select>
                  </el-form-item>
                </div>
                <span class="layoutspan">
                  <i>*</i>区县 :
                </span>&nbsp;
                <div class="layoutBox" style="width:200px">
                  <el-form-item prop="county">
                    <el-select v-model="pollutionFormData.county" placeholder="请选择">
                      <el-option
                        v-for="item in countyData"
                        :key="item.id"
                        :label="item.name"
                        :value="item.id"
                      ></el-option>
                    </el-select>
                  </el-form-item>
                </div>
              </li>
              <li></li>
              <li>
                <span class="layoutspan">站点地址 :</span>&nbsp;
                <div class="layoutBox" style="width:863px">
                  <el-input v-model="pollutionFormData.stationAddress"></el-input>
                </div>
              </li>
            </el-form>
          </ul>
        </div>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button type="noticon" @click="addSure('waterForm')">保 存</el-button>
        <el-button type="noticonsecondBtn" @click="closesDia">关 闭</el-button>
      </div>
    </el-dialog>
    <el-dialog :visible.sync="mapDialog" width="1065px" title="地图">
      <div class="map">
        <div class="inputbox" style="margin-bottom:10px">
          <div class="layoutBox" style="width:100px;">
            <el-input v-model="lng"></el-input>
          </div>
          <div class="layoutBox" style="width:100px;">
            <el-input v-model="lat"></el-input>
          </div>
          <el-button type="noticon" @click="mapDialog=false">确定</el-button>
        </div>
        <div class="mapbox" style="height:400px">
          <mapComp ref="cmap" @getLongLat="getLongLat"></mapComp>
        </div>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import mapComp from "@/views/systemManage/map";
// import UE from "../../components/ue/ue.vue";
var treedata = [
  {
    label: "一级",
    id: 1,
    children: [
      {
        label: "二级 1",
        id: 2,
        children: [
          {
            label: "三级 1-1",
            id: 3,
            children: [
              {
                label: "三级 1-1-1",
                id: 4
              },
              {
                label: "三级 1-1-2",
                id: 5
              },
              {
                label: "三级 1-1-3",
                id: 6
              }
            ]
          }
        ]
      }
    ]
  }
];
export default {
  name: "",
  components: {  mapComp },
  data() {
    return {
      lng: "", //经度
      lat: "", //纬度
      mapDialog: false, //地图弹框
      stationDialog: false, //站点新增弹框
      s_Type: "water",
      visiDialog: false,
      radio: "1",
      date: "",
      value1: "",
      radio: "1",
      value: [],
      value5: [],
      optionData: [],
      tableData: [{}],
      input1: "宇星科技发展(深圳)有限公司",
      input: "",
      treeConfig: {
        showCheckbox: false,
        defaultId: 9,
        defaultText: "三级 1-1-1"
      },
      treedata: treedata,
      stationDes: "",
      isEditor: false, //是否为编辑状态
      logContext1: "1",
      logContext2: "2",

      configone: {
        id: "ueone",
        initialFrameWidth: null,
        initialFrameHeight: 250,
        initialFrameWidth: null,
        autoHeightEnabled: false,
        toolbars: [
          [
            "source",
            "|",
            "undo",
            "redo",
            "|",
            "bold",
            "italic",
            "underline",
            "fontborder",
            "strikethrough",
            "superscript",
            "subscript",
            "removeformat",
            "formatmatch",
            "autotypeset",
            "blockquote",
            "pasteplain",
            "|",
            "forecolor",
            "backcolor",
            "insertorderedlist",
            "insertunorderedlist",
            "selectall",
            "cleardoc",
            "|",
            "rowspacingtop",
            "rowspacingbottom",
            "lineheight",
            "|",
            "customstyle",
            "paragraph",
            "fontfamily",
            "fontsize",
            "|",
            "directionalityltr",
            "directionalityrtl",
            "indent",
            "|",
            "justifyleft",
            "justifycenter",
            "justifyright",
            "justifyjustify",
            "|",
            "touppercase",
            "tolowercase",
            "|",
            "preview"
          ]
        ]
      },
      configtwo: {
        id: "uetwo",
        initialFrameWidth: null,
        initialFrameHeight: 250,
        initialFrameWidth: null,
        autoHeightEnabled: false,
        toolbars: [
          [
            "source",
            "|",
            "undo",
            "redo",
            "|",
            "bold",
            "italic",
            "underline",
            "fontborder",
            "strikethrough",
            "superscript",
            "subscript",
            "removeformat",
            "formatmatch",
            "autotypeset",
            "blockquote",
            "pasteplain",
            "|",
            "forecolor",
            "backcolor",
            "insertorderedlist",
            "insertunorderedlist",
            "selectall",
            "cleardoc",
            "|",
            "rowspacingtop",
            "rowspacingbottom",
            "lineheight",
            "|",
            "customstyle",
            "paragraph",
            "fontfamily",
            "fontsize",
            "|",
            "directionalityltr",
            "directionalityrtl",
            "indent",
            "|",
            "justifyleft",
            "justifycenter",
            "justifyright",
            "justifyjustify",
            "|",
            "touppercase",
            "tolowercase",
            "|",
            "preview"
          ]
        ]
      },
      controlorData: [
        {
          label: "国控",
          value: 0
        },
        {
          label: "省控",
          value: 1
        },
        {
          label: "市控/州控",
          value: 2
        },
        {
          label: "县控/区控",
          value: 3
        }
      ], //控制级别下拉框数据
      stationTypeData: [
        {
          label: "水站",
          value: "001"
        },
        {
          label: "污染源站",
          value: "002"
        }
      ], //站点类别下拉数据
      targetDataA: [
        {
          label: "Ⅰ类",
          value: "1"
        },
        {
          label: "Ⅱ类",
          value: "2"
        },
        {
          label: "Ⅲ类",
          value: "3"
        },
        {
          label: "Ⅳ类",
          value: "4"
        },
        {
          label: "Ⅴ类",
          value: "5"
        },
        {
          label: "劣Ⅴ类",
          value: "6"
        }
      ], //水质等级下拉框
      targetDataB: [
        {
          label: "一级",
          value: "1"
        },
        {
          label: "二级",
          value: "2"
        },
        {
          label: "三级",
          value: "3"
        }
      ], //排放标准下拉框
      waterFormData: {
        stationName: "", //站点名称
        stationCode: "", //站点编码
        controlorLevel: "", //控制等级
        stationType: "001", //站点类别
        targetLevel: "", //目标等级
        longitude: "", //经度
        latitude: "", //纬度
        stationAddress: "", //站点地址
        county: "",
        city: ""
      }, //水站表格数据
      pollutionFormData: {
        county: "",
        city: "",
        stationName: "", //站点名称
        stationCode: "", //站点编码
        controlorLevel: "", //控制等级
        stationType: "002", //站点类别
        targetLevel: "", //目标等级
        longitude: "", //经度
        latitude: "", //纬度
        stationAddress: "" //站点地址
      }, //污染源站表格数据
      pollution: {
        county: "",
        city: "",
        stationName: "", //站点名称
        stationCode: "", //站点编码
        controlorLevel: "", //控制等级
        stationType: "", //站点类别
        targetLevel: "", //目标等级
        longitude: "", //经度
        latitude: "", //纬度
        stationAddress: "" //站点地址
      },
      water: {
        county: "",
        city: "",
        stationName: "", //站点名称
        stationCode: "", //站点编码
        controlorLevel: "", //控制等级
        stationType: "", //站点类别
        targetLevel: "", //目标等级
        longitude: "", //经度
        latitude: "", //纬度
        stationAddress: "" //站点地址
      },
      stationType: "",
      stationCode: "", //站点ID
      waterruleData: {
        stationName: [
          { required: true, message: "请输入断面名称", trigger: "blur" },
          { min: 3, max: 15, message: "长度在 3 到 15 个字符", trigger: "blur" }
        ],
        stationCode: [
          { required: true, message: "请输入断面编号", trigger: "blur" },
          { min: 3, max: 15, message: "长度在 3 到 15 个字符", trigger: "blur" }
        ],
        longitude: [{ required: true, message: "请输入经度", trigger: "blur" }],
        latitude: [{ required: true, message: "请输入纬度", trigger: "blur" }],
        controlorLevel: [
          { required: true, message: "请选择控制等级", trigger: "change" }
        ],
        stationType: [
          { required: true, message: "请选择站点类别", trigger: "change" }
        ],
        targetLevel: [
          { required: true, message: "请选择水质目标级别", trigger: "change" }
        ],
        city: [{ required: true, message: "请选择城市", trigger: "change" }],
        county: [{ required: true, message: "请选择区县", trigger: "change" }]
      },
      pollutionruleData: {
        stationName: [
          { required: true, message: "请输入排污口名称", trigger: "blur" },
          { min: 3, max: 15, message: "长度在 3 到 15 个字符", trigger: "blur" }
        ],
        stationCode: [
          { required: true, message: "请输入排污口编号", trigger: "blur" },
          { min: 3, max: 15, message: "长度在 3 到 15 个字符", trigger: "blur" }
        ],
        longitude: [{ required: true, message: "请输入经度", trigger: "blur" }],
        latitude: [{ required: true, message: "请输入纬度", trigger: "blur" }],
        controlorLevel: [
          { required: true, message: "请选择控制等级", trigger: "change" }
        ],
        stationType: [
          { required: true, message: "请选择站点类别", trigger: "change" }
        ],
        targetLevel: [
          { required: true, message: "请选择排放标准", trigger: "change" }
        ],
        city: [{ required: true, message: "请选择城市", trigger: "change" }],
        county: [{ required: true, message: "请选择区县", trigger: "change" }]
      },
      lnglatSet: "",
      cityData: [],
      countyData: [],
      cityId: ""
    };
  },
  inject: ["searchTreeData"],
  created() {
    this.$store.commit("setShowlefttree", true);
  },
  methods: {
    openMap(n) {
      this.mapDialog = true;
      this.lnglatSet = n;
    },
    selectChange(arr) {
      this.selectCheck = arr;
    },
    indexMethod(index) {
      return index + 1;
    },
    search(callback) {},
    closess() {
      this.stationDialog = false;
      this.resetForm("waterForm");
      this.resetForm("pollutionForm");
    },
    closesDia() {
      this.stationDialog = false;
      this.pollutionFormData.stationAddress = "";
      this.waterFormData.stationAddress = "";
      this.resetForm("pollutionForm");
      this.resetForm("waterForm");
    },
    checkedNode(val) {
      console.log(val);
    },
    getLongLat(v) {
      this.lat = v.lat.toFixed(5);
      this.lng = v.lng.toFixed(5);
      if (this.lnglatSet == "water") {
        this.water.latitude = this.lat;
        this.water.longitude = this.lng;
      } else if (this.lnglatSet == "waterF") {
        this.waterFormData.latitude = this.lat;
        this.waterFormData.longitude = this.lng;
      } else if (this.lnglatSet == "pollution") {
        this.pollution.latitude = this.lat;
        this.pollution.longitude = this.lng;
      } else if (this.lnglatSet == "pollutionF") {
        this.pollutionFormData.latitude = this.lat;
        this.pollutionFormData.longitude = this.lng;
      }
    },
    //添加站点状态切换
    addStation() {
      this.stationDialog = true;
    },

    //保存站点信息
    saveStation(formName) {
      this.$refs[formName].validate(valid => {
        if (valid) {
          if (this.s_Type == "water") {
            let areaName = "";
            let cityName ='';
            for (let i in this.countyData) {
              if (this.water.county == this.countyData[i].id) {
                areaName = this.countyData[i].name;
              }
            };
            for (let i in this.cityData) {
              if (this.water.city == this.cityData[i].id) {
                cityName = this.cityData[i].name;
              }
            }
            let params = {
              areaName: areaName,
              city: this.water.city,
              cityName:cityName,
              areaId: this.water.county,
              stationId: this.stationId,
              stationName: this.water.stationName, //站点名称
              stationCode: this.water.stationCode, //站点编码
              controlorLevel: this.water.controlorLevel, //控制等级
              stationType: this.water.stationType, //站点类别
              targetLevel: this.water.targetLevel, //目标等级
              longitude: this.water.longitude, //经度
              latitude: this.water.latitude, //纬度
              stationAddress: this.water.stationAddress //站点地址
            };

            this.$http
              .post("/SiteManagement/station/editOrAdd", params)
              .then(res => {
                this.stationDialog = false;
                this.getStationMes();
                this.searchTreeData();
              });
          } else if (this.s_Type == "pollution") {
            let areaName = "";
            let cityName='';
            for (let i in this.countyData) {
              if (this.pollution.county == this.countyData[i].id) {
                areaName = this.countyData[i].name;
              }
            };
             for (let i in this.cityData) {
              if (this.pollution.city == this.cityData[i].id) {
                cityName = this.cityData[i].name;
              }
            }
            let params = {
              areaName: areaName,
              cityName:cityName,
              city: this.pollution.city,
              areaId: this.pollution.county,
              stationId: this.stationId,
              stationName: this.pollution.stationName, //站点名称
              stationCode: this.pollution.stationCode, //站点编码
              controlorLevel: this.pollution.controlorLevel, //控制等级
              stationType: this.pollution.stationType, //站点类别
              targetLevel: this.pollution.targetLevel, //目标等级
              longitude: this.pollution.longitude, //经度
              latitude: this.pollution.latitude, //纬度
              stationAddress: this.pollution.stationAddress //站点地址
            };

            this.$http
              .post("/SiteManagement/station/editOrAdd", params)
              .then(res => {
                this.stationDialog = false;
                this.getStationMes();
                this.searchTreeData();
              });
          }
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
    //获取站点信息
    getStationMes() {
      this.$http
        .get("/SiteManagement/station/queryStation", {
          params: {
            stationCode: this.stationCode
          }
        })
        .then(res => {
          this.stationId = res.data.content.dataList[0].STATION_ID;
          this.cityId=res.data.content.dataList[0].CITY;
          this.getCounty()
          if (this.s_Type == "water") {
            this.resetForm("wform");
            let obj = res.data.content.dataList[0];
            this.water = {
              stationName: obj.STATION_NAME, //站点名称
              stationCode: obj.STATION_MN, //站点编码
              controlorLevel: obj.CONTROL_LEVEL, //控制等级
              stationType: obj.STATION_TYPE1, //站点类别
              targetLevel: obj.TARGER_WATER_QUALITY, //目标等级
              longitude: obj.LONGITUDE, //经度
              latitude: obj.LATITUDE, //纬度
              stationAddress: obj.STATION_ADDRESS, //站点地址
              stationAddress: obj.STATION_ADDRESS, //站点地址
              city: obj.CITY, //站点地址
              county: obj.AREA_ID
            };
          } else if (this.s_Type == "pollution") {
            this.resetForm("pform");
            let obj = res.data.content.dataList[0];
            this.pollution = {
              stationName: obj.STATION_NAME, //站点名称
              stationCode: obj.STATION_MN, //站点编码
              controlorLevel: obj.CONTROL_LEVEL, //控制等级
              stationType: obj.STATION_TYPE1, //站点类别
              targetLevel: obj.TARGER_WATER_QUALITY, //目标等级
              longitude: obj.LONGITUDE, //经度
              latitude: obj.LATITUDE, //纬度
              stationAddress: obj.STATION_ADDRESS, //站点地址
              city: obj.CITY, //站点地址
              county: obj.AREA_ID
            };
          }
        });
    },
    // 确认添加站点
    addSure(formName) {
      this.$refs[formName].validate(valid => {
        if (valid) {
          if (this.s_Type == "water") {
            let areaName = "";
            let cityName="";
            for (let i in this.countyData) {
              if (this.waterFormData.county == this.countyData[i].id) {
                areaName = this.countyData[i].name;
              }
            }
             for (let i in this.cityData) {
              if (this.waterFormData.city == this.cityData[i].id) {
                cityName = this.cityData[i].name;
              }
            }
            let params = {
              cityName:cityName,
              areaNames: areaName,
              city: this.waterFormData.city,
              areaId: this.waterFormData.county,
              stationName: this.waterFormData.stationName, //站点名称
              stationCode: this.waterFormData.stationCode, //站点编码
              controlorLevel: this.waterFormData.controlorLevel, //控制等级
              stationType: this.waterFormData.stationType, //站点类别
              targetLevel: this.waterFormData.targetLevel, //目标等级
              longitude: this.waterFormData.longitude, //经度
              latitude: this.waterFormData.latitude, //纬度
              stationAddress: this.waterFormData.stationAddress //站点地址
            };

            this.$http
              .post("/SiteManagement/station/editOrAdd", params)
              .then(res => {
                this.stationDialog = false;

                this.resetForm(formName);
                this.searchTreeData();
              });
          } else if (this.s_Type == "pollution") {
            let areaName = "";
            let cityName="";
            for (let i in this.countyData) {
              if (this.pollutionFormData.county == this.countyData[i].id) {
                areaName = this.countyData[i].name;
              }
            }
             for (let i in this.cityData) {
              if (this.pollutionFormData.city == this.cityData[i].id) {
                cityName = this.cityData[i].name;
              }
            }
            let params = {
              cityName:cityName,
              areaNames: areaName,
              city: this.pollutionFormData.city,
              areaId: this.pollutionFormData.county,
              stationName: this.pollutionFormData.stationName, //站点名称
              stationCode: this.pollutionFormData.stationCode, //站点编码
              controlorLevel: this.pollutionFormData.controlorLevel, //控制等级
              stationType: this.pollutionFormData.stationType, //站点类别
              targetLevel: this.pollutionFormData.targetLevel, //目标等级
              longitude: this.pollutionFormData.longitude, //经度
              latitude: this.pollutionFormData.latitude, //纬度
              stationAddress: this.pollutionFormData.stationAddress //站点地址
            };

            this.$http
              .post("/SiteManagement/station/editOrAdd", params)
              .then(res => {
                this.stationDialog = false;
                this.resetForm(formName);
                this.searchTreeData();
              });
          }
        } else {
          return false;
        }
      });
    },
    resetForm(formName) {
      if (this.$refs[formName]) {
        this.$refs[formName].resetFields();
      }
    },
    //获取城市
    getCity() {
      this.$http.get("/SiteManagement/area/provinceInfo").then(res => {
        this.cityData = res.data.content.dataList;
      });
    },
    //获取区县
    getCounty() {
      this.$http
        .get("/SiteManagement/area/areaInfo", {
          params: {
            name: this.cityId
          }
        })
        .then(res => {
          this.countyData = res.data.content.dataList;
        });
    },
    cityChange(v) {
      this.cityId = v;
      this.getCounty();
    }
  },
  computed: {
    stationInfo: {
      get: function() {
        return this.$store.state.stationInfo;
      }
    }
  },
  watch: {
    stationInfo(value) {
      this.getCity();
      if (value.length > 0) {
        if (value[0].stationType1 === "002") {
          this.s_Type = "pollution";
          this.stationDes = "排污口信息";
        } else if (value[0].stationType1 === "001") {
          this.s_Type = "water";
          this.stationDes = "断面信息";
        }
        this.stationCode = value[0].nodeId;

        this.getStationMes();
      }
    }
  }
};
</script>

<style scoped lang="less">
.historypage {
  height: 100%;
}

.edui-editor {
  background: #fff;
}
.baseinfo {
  padding: 12px;
  li {
    margin-bottom: 30px;
    .layoutBox {
      height: 30px;
      line-height: 30px;
    }
    .layoutspan {
      width: 120px;
      i {
        color: red;
        margin-right: 4px;
      }
    }
    .sousuo {
      cursor: pointer;
      display: inline-block;
      width: 34px;
      height: 30px;
      vertical-align: -2px;
      line-height: 30px;
      text-align: center;
    }
  }
}
</style>
